<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <section>section</section>
    <section>section</section>

    <article>article</article>
    <article>article</article>
    <header>header</header>
    <header>header</header>
    <footer>footer</footer>
    <footer>footer</footer>
    <aside>aside</aside>
    <aside>aside</aside>
    <article>article</article>
    <article>article</article>
    <p>p</p>
    <p>p</p>
    <div>div</div>
    <div>div</div>
    <ul>
      <li>12</li>
      <li>12</li>
    </ul>
    <!-- 
    语义化的理解：
    1.在开发的过程中更容易读懂当前页面的内容，增加代码的可读性，提高代码的维护性。
    2.让搜索引擎更容易理解页面的结构，提高搜索排名（SEO）。
    -->
  </body>
</html>
